<template >
    <div style="min-width:1100px">
        <Demandprogress :currentIndex="demandIndex"></Demandprogress>
        <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="100">
            <Row>
                <Col span="15">
                    <FormItem label="标题" prop="title">
                        <Input v-model="formValidate.title" placeholder="标准：地区+某（资金主体/资金类型）+金额+寻某项目+合作" :readonly="$route.query.detail == 1"></Input>
                    </FormItem>
                </Col>
            </Row>
            <!-- <Row>
                <Col span="15">
                    <FormItem label="需求编号" prop="number">
                        <Input v-model="formValidate.number" :readonly="true"></Input>
                    </FormItem>
                </Col>
            </Row> -->
            <Row>
                <Col span="10">
                    <FormItem label="状态">
                        <Button :type="status.type">{{status.message}}</Button>
                    </FormItem>
                </Col>
            </Row>
            <Row>
                <Col span="10">
                    <FormItem label="公司名称">
                        <Input v-model="info.enterprise_name" readonly></Input>
                    </FormItem>
                </Col>
            </Row>
            <FormItem label="所在地区" prop="demand_area"  style="margin-left:10%;">
                <Row style="margin-left:0px">
                    <Col span="12">
                        <al-selector v-model="formValidate.demand_area" data-type="name" level="2" :disabled="$route.query.detail == 1"/>
                    </Col>
                </Row>
            </FormItem>
            <Row>
                <Col span="10">
                    <FormItem label="需求类别" prop="m_type">
                        <Select v-model="formValidate.m_type" placeholder="请选择需求类别"  :disabled="$route.query.detail == 1">
                            <Option v-for="item in type.usual_service.children" v-if="item.url=='#'" :value="item.name">{{item.name}}</Option>
                        </Select>
                    </FormItem>
                    <!-- <FormItem label="需求类别" prop="demand_type">
                        <Select v-model="formValidate.demand_type" placeholder="请选择所属类别"  :disabled="$route.query.detail == 1">
                            <Option v-for="item in type.demand.children" :value="item.name">{{item.name}}</Option>
                        </Select>
                    </FormItem> -->
                </Col>
            </Row>
            <Row>
                <Col span="10">
                    <FormItem label="所属行业" prop="demand_industry">
                        <IndustryAlterMultSelector v-model="formValidate.demand_industry" :disabled="$route.query.detail == 1"></IndustryAlterMultSelector>
                        <span>{{formValidate.demand_industry.join(",")}}</span>
                    </FormItem>
                </Col>
            </Row>
             <Row>
                <Col span="20">
                    <FormItem label="项目简介" prop="demand_content">   
                         <Input v-model="formValidate.demand_content" type="textarea" :autosize="{minRows: 10}" placeholder="请输入项目简介，比如目前发展情况，总体建设计划时间，资金使用计划等内容" :readonly="$route.query.detail == 1"></Input>
                    </FormItem>
                </Col>
            </Row>
                <Row>                    
                    <Col span="10">       
                        <FormItem label="联系人" prop="demand_master">
                            <Input v-model="formValidate.demand_master" placeholder="请输入联系人" :readonly="$route.query.detail == 1"></Input>
                        </FormItem>
                    </Col>
                    <Col span="10">       
                        <FormItem label="联系电话" prop="demand_tele">
                            <Input v-model="formValidate.demand_tele" placeholder="请输入联系人电话" :readonly="$route.query.detail == 1"></Input>
                        </FormItem>
                    </Col>
                </Row>
                <Row>
                       <Col span="10">       
                            <FormItem label="联系地址" prop="demand_address">
                            <Input v-model="formValidate.demand_address" placeholder="请输入联系地址" :readonly="$route.query.detail == 1"></Input>
                            </FormItem>
                        </Col>
                </Row>
            <div style="1px solid #cdcdcd" v-if="rzShow">
                <Row>
                    <Col span="8">
                      <FormItem label="项目开始日期" >
                        <i-col span="12">
                            <Date-picker type="date" v-model="formValidate.demand_beginDate" placeholder="选择开始融资日期" style="width: 200px" :disabled="$route.query.detail == 1"></Date-picker>
                        </i-col>
                      </FormItem>
                    </Col>
                    <Col span="8">
                     <FormItem label="项目结束日期" >
                        <i-col span="12">
                            <Date-picker type="date" v-model="formValidate.demand_endDate" placeholder="选择融资结束日期" style="width: 200px" :disabled="$route.query.detail == 1"></Date-picker>
                        </i-col>
                     </FormItem>
                    </Col>
                </Row>
                <Row>
                    <Col span="10">
                        <FormItem label="项目类别" prop="item_type">
                            <Select v-model="formValidate.item_type" placeholder="请选择项目所属类别" :disabled="$route.query.detail == 1">
                                <Option v-for="item in item_type" :value="item.title">{{item.title}}</Option>
                            </Select>
                        </FormItem>
                    </Col>
                </Row>
                <Row>
                    <Col span="5">
                        <FormItem label="总投资(万元)">   
                            <Input-number v-model="formValidate.demand_invest" :min="1" :value="1" :readonly="$route.query.detail == 1"></Input-number>
                        </FormItem>
                    </Col>
                    <Col span="5">
                        <FormItem label="已投资(万元)" >   
                            <Input-number v-model="formValidate.demand_presentInvest"  :min="1" :value="1" :readonly="$route.query.detail == 1"></Input-number>
                        </FormItem>
                    </Col>
                    <Col span="5">
                        <FormItem label="需融资(万元)" >   
                            <Input-number v-model="formValidate.demand_needInvest"  :min="1" :value="1" :readonly="$route.query.detail == 1"></Input-number>
                        </FormItem>
                    </Col>
                </Row>
                <Row>
                    <Col span="20">
                        <FormItem label="融资方式" prop="operation">
                            <Input v-model="formValidate.demand_operation" :readonly="$route.query.detail == 1"></Input>
                        </FormItem>
                    </Col>
                </Row>
                <Row>
                    <Col span="20">
                        <FormItem label="融资用途" prop="use">
                            <Input v-model="formValidate.demand_use"  type="textarea" :autosize="{minRows: 3,maxRows: 10}" placeholder="请输入融资用途" :readonly="$route.query.detail == 1"></Input>
                        </FormItem>
                    </Col>
                </Row>
                <Row>
                    <Col span="20">
                        <FormItem label="抵押物" prop="diya">
                            <Input v-model="formValidate.demand_diya"  placeholder="请输入抵押物" :readonly="$route.query.detail == 1"></Input>
                        </FormItem>
                    </Col>
                </Row>
            </div>
             <Row>
                <Col span="20">       
                    <FormItem label="备注" >
                        <Input v-model="formValidate.demand_remark" type="textarea" :autosize="{minRows: 3,maxRows: 10}" placeholder="如果您还有需要填写的内容请填入备注内" :readonly="$route.query.detail == 1"></Input>
                    </FormItem> 
                </Col>
            </Row>
            <Row>
                <Col v-if="serviceBtn">
                    <FormItem label="附件" prop="appendix">
                        <UploadedList  v-model="formValidate.appendix" :format="['doc','docx','pdf']"></UploadedList>
                    </FormItem>
                </Col>
                <Col v-if="!serviceBtn">
                    <FormItem label="附件">
                        <a v-for="item in appendixList" :href="item.appendixUrl">{{item.appendixName}}<br></a>
                    </FormItem>
                </Col>
            </Row>
            <Row>
                <Col>
                    <FormItem label="安全" prop="safety_grade">
                        <RadioGroup v-model="formValidate.safety_grade">
                            <Radio :label="0" :disabled="$route.query.detail == 1">任何人可见</Radio>
                            <Radio :label="1" :disabled="$route.query.detail == 1">服务机构可见</Radio>
                            <!-- <Radio label="2" :disabled="$route.query.detail == 1">仅指定服务机构可见</Radio> -->
                        </RadioGroup>
                    </FormItem>
                </Col>
            </Row>
            <Row>
                <Col span="8">
                    <FormItem>
                        <Button type="primary" v-if="serviceBtn && this.info.status === 2"  @click="handleSubmit('formValidate')" :loading="waiting_button==1" :disabled="waiting_button!=1&&waiting_button!=0">发布需求</Button>
                        <Button type="ghost" v-if="serviceBtn"  @click="handleDraft('formValidate')" style="margin-left: 8px" :loading="waiting_button==2" :disabled="waiting_button!=2&&waiting_button!=0">存为草稿</Button>
                         <Button type="primary" v-if="!serviceBtn&&recycleBtn"   @click="handleRecycle('formValidate')" style="margin-left: 8px" :loading="waiting_button==2" :disabled="waiting_button!=1&&waiting_button!=0">回收服务</Button>
                        <Button type="primary" v-if="!serviceBtn"   @click="handleReturn()" style="margin-left: 8px" >返回</Button>
                    </FormItem>
                </Col>
            </Row>
        </Form>
    </div>
</template>
<script>
    import Demand from "@/common/model/Demand";
    import UploadedList from "@/common/components/UploadedList";
    import Demandprogress from '../main-components/progress';
    import IndustryAlterMultSelector from "../main-components/industry-alter-mult-selector";
    
    export default {
        components: {
             UploadedList, Demandprogress, IndustryAlterMultSelector
        },
        data () {
            const validateArea = (rule, value, callback)=>{
                if(this.formValidate.demand_area.length < 2){
                    callback(new Error("请选择所属地区！"));
                }else{
                    callback();
                }
            };
            const validateIndustry = (rule, value, callback)=>{
                if(this.formValidate.demand_industry.length==0){
                    callback(new Error("所属行业不能为空"));
                }else{
                    callback();
                }
            };
            return {
                demandIndex:0,
                disable:false,
                serviceBtn: false,
                recycleBtn: false,
                rzShow: true,
                formValidate: new Demand(),
                // member:'',
                ruleValidate: {
                    title:[
                        {required:true,message:'项目标题不能为空',trigger:'blur'}
                    ],
                    m_type:[
                        {required:true, message:'所属平台不能为空', trigger: 'change'}
                    ],
                    demand_type:[
                        {required:true, message:'需求类别不能为空', trigger: 'change'}
                    ],
                    demand_industry:[
                        {required:true, validator: validateIndustry}
                    ],
                    demand_master:[
                        {required:true,message:'公司联系人不能为空',trigger:'blur'}
                    ],
                    demand_tele:[
                        {required:true,message:'公司联系人电话不能为空',trigger:'blur'}
                    ],
                    demand_address:[
                         {required:true,message:'联系地址不能为空',trigger:'blur'}
                    ],
                    demand_area: [
                        { required: true, validator: validateArea, trigger: 'change' }
                    ],
                },
                item_type: [
                    {
                        title:'全市重点项目'
                    },
                    {
                        title:'各县区重点项目'
                    },
                    {
                        title:'各县区企业融资需求发布'
                    }
                ],
                waiting_button: 0,
                status:{
                    type:'primary',
                    message:'草稿箱'
                },
                appendixList:[]
            }
        },
        methods: {
            handleSubmit (name) {
                this.$refs[name].validate((valid) => {
                    this.waiting_button = 1;
                    if (valid) {
                        //console.log(this.formValidate.id)
                        if(this.formValidate.id) {
                            if(this.formValidate.status != 0 && !confirm("修改后需要等待管理员审核，确认修改吗？")) {this.waiting_button = 0; return;}
                            else{
                                this.api.post("demand/re_post", this.formValidate.serialize(), res => {
                                    this.formValidate.status = res.value;
                                    if(this.formValidate.status == 1){
                                        this.$CustomMessage.success('提交成功，等待审核通过!');
                                    }else{
                                        this.$CustomMessage.success('审核成功，已发布!');
                                    }
                                    //this.waiting_button = 0;
                                    this.$router.push({
                                        name:'posted_demand_projects'
                                })
                            });
                        }
                    }else{
                        if(!confirm("提交信息后管理员将进行审核，不可以进行修改，确定要进行提交吗？")) return;
                        this.api.post("demand/post", this.formValidate.serialize(), res => {
                            this.formValidate.status = res.value;
                            if(this.formValidate.status == 1){
                                this.$CustomMessage.success('提交成功，等待审核通过!');
                            }else{
                                this.$CustomMessage.success('审核成功，已发布!');
                            }
                            this.waiting_button = 0;
                            this.$router.push({
                                name:'posted_demand_projects'
                            });
                        });
                    }
                }else {
                    this.$CustomMessage.error('表单信息填写有误，请仔细检查!');
                    this.waiting_button = 0;
                }
                })
            },
            handleDraft (name) {
                if(this.formValidate.title && !this.formValidate.id){
                    this.waiting_button = 2;
                    this.api.post("demand/draft", this.formValidate.serialize(), res => {
                        this.formValidate.id = res.id;
                        this.formValidate.status = 0;
                        this.$CustomMessage.success('已存为草稿!');
                        this.waiting_button = 0;
                        this.$router.push({
                            name:'posted_demand_projects'
                        })
                    });
                }else if(this.formValidate.id){
                    this.api.post("demand/re_draft", this.formValidate.serialize(), res => {
                        this.formValidate.id = res.id;
                        this.formValidate.status = 0;
                        this.$CustomMessage.success('已存为草稿!');
                        this.waiting_button = 0;
                        this.$router.push({
                            name:'posted_demand_projects'
                        })
                    });
                }else{
                     this.$CustomMessage.error('请填入该项目名称!');
                }
            },
            handleRecycle(name){
                if(this.formValidate.id) {
                        if(!confirm("确定将已发布的项目回收吗，回收后不可恢复？")){this.waiting_button = 0; return;} 
                        else if(this.formValidate.status == 1) {
                            this.$CustomMessage.error('该项目正在审核，不能回收!');
                            this.waiting_button = 0;
                            }
                        else if(this.formValidate == 4){
                            this.$CustomMessage.error('该项目已回收，不能重复回收!');
                            this.waiting_button = 0;
                        }
                        else{
                            this.api.post("demand/recycle", this.formValidate.serialize(), res => {
                                this.formValidate.status = 4;
                                this.$CustomMessage.success('回收成功!');
                                this.waiting_button = 0;
                                this.serviceBtn = false;
                                this.$router.push({
                                    name:'posted_demand_projects'
                            });
                        });
                    }
                }
            },
            formatStatus(){
                var status = { type: "", message: "" };
                if(this.formValidate.status== 0){
                        status.type = "primary"
                         this.demandIndex = 0;
                        status.message = "草稿箱";
                    }else if(this.formValidate.status== 1){
                        status.type = "info"
                        this.demandIndex = 1;
                        status.message = "审核中";
                    }else if(this.formValidate.status== 2){
                        status.type = "success"
                        this.demandIndex = 2;
                        status.message = "已发布"
                    }else if(this.formValidate.status==3){
                        status.type = "error"
                        this.demandIndex = 0;
                        status.message = "审核未通过"
                    }else if(this.formValidate.status==4)
                    {
                        status.type = "warning"
                        this.demandIndex = 3;
                        status.message = "已回收"
                    }
                return status;
            },
            handleReturn(){
                this.$router.go(-1);
            }
        },
        computed:{
            info:function(){
                return this.$store.state.user.info;
            },
            type:function(){
                return this.$store.state.app.dicTree;
            },
        },
        created() {     
            this.api.post("me/get_info",res => {
                if(res.data.status === 2 || this.$route.query.id){
                    if(this.$route.query.id){
                        this.api.post("demand/get", { id: this.$route.query.id }, res => {
                                //console.log(res.data)
                                this.formValidate.parse(res.data);
                                this.status = this.formatStatus();
                                this.disable = true;
                                if(this.formValidate.appendix != null){
                                var count = this.formValidate.appendix.length;
                                for(var i = 0; i < count; i++){
                                    var appendixUrl = this.formValidate.appendix[i].url;
                                    var appendixName = this.formValidate.appendix[i].name;
                                    this.appendixList.push({'appendixUrl': appendixUrl,'appendixName': appendixName});
                                }    
                                //detail:0 代表修改 detail：1 代表详情
                                if(!this.$route.query.detail){
                                    this.serviceBtn = true;
                                }else if(this.formValidate.status != 4){
                                    this.serviceBtn = false;
                                    this.recycleBtn = true;  
                                }
                            }
                        });
                    }else{
                        this.serviceBtn = true;
                    }    
                }else if(res.data.status == 0){
                    this.$Modal.warning({
                        content: '您的个人信息还未完善，不能发布供需信息，请完善后提交审核',
                        duration: 30,
                        closable: true,
                        onOk: () => {
                            this.$router.push({
                                name:'account_safe'
                            });
                        }
                    });
                }else if(res.data.status == 1){
                            this.$Modal.warning({
                            content: '您的个人信息正在审核，不能发布供需信息,请耐心等待',
                            duration: 30,
                            closable: true,
                            onOk: () => {
                            this.$router.push({
                                name:'account_safe'
                            });
                        }
                    });
                }else if(res.data.status == 3) {
                        this.$Modal.warning({
                            content: '您的个人信息审核未通过，不能发布供需信息，请编辑个人信息后再次提交',
                            duration: 30,
                            closable: true,
                            onOk: () => {
                            this.$router.push({
                                name:'account_safe'
                            });
                        }
                        });
                    }
                });
            }
        }
</script>
<style scoped>
 .ivu-row{
        width: 80%;
        margin: 0 auto;
    }
</style>
